<template>
    <div>
      {{str}}---{{ num }}
      <button @click="add(2)">+2</button>
      <button @click="sub($event)">-1</button>

      <div>{{ str }}</div>
      <a v-bind:href="url" target="_blank">{{ name }}</a>
      <img :src="imgUrl"/>
      
    </div>
</template>
<script setup>
 import{ ref } from 'vue'
let num = ref(10)
let str = 'hello'
let name = ref('百度一下')
let url = ref('https://www.baidu.com')
let imgUrl = ref('https://ts1.cn.mm.bing.net/th/id/R-C.ec0c0295cf820867eb8fabafe76981a5?rik=FXW1r50Dc7bnmg&riu=http%3a%2f%2fimg.pptjia.com%2fimage%2f20180424%2f6299465af46e6a7f3313ce07538994aa.jpg&ehk=y40EbREUL98hRYVkRWRPFH7SkTPdeg4Y6F1%2fagt0bMI%3d&risl=&pid=ImgRaw&r=0')
//let add = ()=>{
    console.log(num);
   num.value++

//}

function add(a){
    num.value+=a
}
let sub = (e)=>{
    console.log(e);

    num.value--
}
</script>
<style scoped>
</style>